<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<c:set var="path" value="${pageContext.request.contextPath }" />
<%@ taglib tagdir="/WEB-INF/tags" prefix="matrix"%>
<%@ taglib uri="http://matrixcsm.zkingsoft.com" prefix="cms"%>
<cms:ads   code="'ZY_GongSiGaiKuang_0',
'ompan_1',
'item_2',
'ZY_LianXiWoMen_3',
'ontac_4',
'ZY_XiangTanTianShiLiQing_5',
'ZY_XiangTanTianShiLiQing_6',
'ZY_DianHua_7',
'ZY_DiZhiXiangTanShi_8',
'menu_9',
'ZY_WangZhanShouYe_10',
'ZY_GongSiGaiKuang_11',
'ZY_XiangTanTianShiLiQing_12',
'img_lt_Ba13',
'ZY_QiYeJingShen_14',
'ZY_TuanJieFenJinTuoFa_15',
'img_xauqD16',
'ZY_JingYingLiNian_17',
'ZY_ZhuiQiuZhuoYueGuanLi_18',
'img_ufBB219',
'ZY_FaZhanYuanJing_20',
'ZY_LiZuHuNanFu_21',
'img_oTsrJ22',
'img_MWOb023'
"  ></cms:ads>
<!doctype html>
<html>
 <head>
  <title>${网页标题}</title>
  <meta charset="UTF-8"> 
  <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
  <link rel="stylesheet" href="http://hwfile.jyymatrix.cc/jiaofatianshi/pc/css/common.css"> 
  <!--[if lt IE 9]>
      <script src="https://cdn.jsdelivr.net/npm/html5shiv@3.7.3/dist/html5shiv.min.js"></script>
      <script src="https://cdn.jsdelivr.net/npm/respond.js@1.4.2/dest/respond.min.js"></script>
    <![endif]--> 
  <style>.carousel-img{ width: 100%; height: 100%; } .el-carousel__arrow{ border-radius: 0; width: 42px; height: 42px; } .el-carousel__arrow i{ font-size: 22px; } .box{ margin: 60px 0; } .article-content{ font-size: 14px; margin-top: 12px; line-height: 24px; text-align: justify; } .business-license-wrap{ margin: 60px 0 0; text-align: center; } .business-license{ display: inline-block; width: 370px; box-shadow: 0 0 8px rgb(9 9 9 / 20%); margin: 0 20px; } .business-license:nth-child(1){ width: 380px; } .list-item{ width: 31.5%; box-shadow: 0 0 8px rgb(9 9 9 / 20%); margin-bottom: 15px; } .list-item img{ width: 100%; height: 180px; } .list-item .title{ text-align: center; padding: 12px 10px ; color: #2574B9; font-size: 16px; } .list-item .desc{ text-align: center; padding: 0 10px 10px ; font-size: 14px; line-height: 22px; }</style> 
  <meta name="keywords" content="${网页关键词}">
  <meta name="description" content="${网页描述 }">
 </head>
 <body> 
  <div id="app"> 
   <jsp:include page="_top.jsp"></jsp:include> 
   <el-carousel indicator-position="none" height="320px"> 
    <el-carousel-item v-for="item in 4" :key="item"> 
     <div style="background: url(http://hwfile.jyymatrix.cc/jiaofatianshi/pc/images/banner.png) no-repeat;background-position: center 35%;background-size: 100% 700px;" class="carousel-img"></div>
    </el-carousel-item> 
   </el-carousel> 
   <div class="box"> 
    <div class="container flex"> 
     <div class="left"> 
      <div class="menu-wrap"> 
       <div class="menu-header">
        <cms:artType var="wzfl" code="${param.parent}"></cms:artType>
        <h2 class="menu-title zy" data-type="ad" data-id="${self.artTypeId}">${self.artTypeName}</h2>
        <h2 class="menu-sub-title zy" data-type="ad" data-id="${self.artTypeId}">${self.artTypeDescription}</h2>
       </div> 
       <div class="menu-list">
        <cms:artType var="wzfl" code="${param.parent}"></cms:artType>
        <c:forEach items="${wzfl }" var="artType" varStatus="status" >
         <p class="menu-item zy" data-code="${artType.code}" :class="${param.code eq artType.code }?'active':''" @click="jumpToArticle('${path }/do/redirect/pc/companyProfileType?code=${artType.code}&pageNow=0&parent=${param.parent}')" data-type="ad" data-id="${artType.artTypeId}">${artType.artTypeName}</p>
        </c:forEach>
       </div> 
      </div> 
      <div class="menu-wrap"> 
       <div class="menu-header"> 
        <h2 class="menu-title zy" data-type="ad" data-id="${ZY_LianXiWoMen_3.adId}">${ZY_LianXiWoMen_3.adTitle}</h2> 
        <h2 class="menu-sub-title zy" data-type="ad" data-id="${ontac_4.adId}">${ontac_4.adTitle}</h2> 
       </div> 
       <div class="menu-content"> 
        <p class="name zy" data-type="ad" data-id="${ZY_XiangTanTianShiLiQing_5.adId}">${ZY_XiangTanTianShiLiQing_5.adTitle}</p> 
        <p class="name zy" data-type="ad" data-id="${ZY_XiangTanTianShiLiQing_6.adId}">${ZY_XiangTanTianShiLiQing_6.adTitle}</p> 
        <div class="mt-20"> 
         <p class="zy" data-type="ad" data-id="${ZY_DianHua_7.adId}">${ZY_DianHua_7.adTitle}</p> 
         <p class="zy" data-type="ad" data-id="${ZY_DiZhiXiangTanShi_8.adId}">${ZY_DiZhiXiangTanShi_8.adTitle}</p> 
        </div> 
       </div> 
      </div> 
     </div> 
     <div class="right flex-1"> 
      <div class="breadcrumb-wrap flex space-between align-center"> 
       <h2 class="name zy" data-type="ad" data-id="${self.artTypeId}">${self.artTypeName}</h2>
       <div> 
        <a href="${ZY_WangZhanShouYe_10.adUrl}" class="zy" data-type="ad" data-id="${ZY_WangZhanShouYe_10.adId}">${ZY_WangZhanShouYe_10.adTitle}</a><span>></span>
        <a href="${path}/do/redirect/pc/companyProfileType?code=${param.code}&pageNow=0&parent=${param.parent}" class="zy">${self.artTypeName}</a>
       </div> 
      </div> 
      <div class="flex space-between flex-wrap">
       <cms:arts var="wzList" code="${param.code }" pageNow="${param.pageNow}" pageSize="10"></cms:arts>
       <c:forEach items="${wzList }" var="art" varStatus="status" >
       <div class="list-item" style="cursor: pointer;" @click="jumpToArticle('${path }/do/redirect/pc/typeArticle?code=${param.code}&pageNow=0&parent=${param.parent}&id=${art.artId}')">
        <img src="${art.artImage}" class="zy" data-type="ad" data-id="${art.artId}">
        <h4 class="title zy" data-type="ad" data-id="${art.artId}">${art.artTitle}</h4>
        <p class="desc zy" data-type="ad" data-id="${art.artId}">${art.artAbstract}</p>
       </div>
       </c:forEach>
      </div>
     </div>
    </div> 
   </div> 
   <jsp:include page="_footer.jsp"></jsp:include> 
  </div>  
  <script src="http://hwfile.jyymatrix.cc/jiaofatianshi/pc/js/vue.js"></script> 
  <script src="http://hwfile.jyymatrix.cc/jiaofatianshi/pc/js/index.js"></script> 
  <script>
        new Vue({
            el: '#app',
            data: function() {
                return { 
                    menuList: ['公司简介', '企业文化', '企业资质'],
                    menuIndex: 0
                }
            },
            created(){
                var type = this.getQueryString('type')
                if(type){
                    this.menuIndex = Number(type);
                }
            },
            mounted(){
                var itemEls = document.getElementsByClassName('nav-item-hover');
                for(var i= 0; i < itemEls.length;i++){
                    itemEls[i].onmouseover = function(){
                        var els = this.getElementsByClassName('nav-layout');
                        if(els.length) {
                            els[0].style.display = 'block'
                        };
                    }
                    itemEls[i].onmouseout = function(){
                        var els = this.getElementsByClassName('nav-layout');
                        if(els.length) {
                            els[0].style.display = 'none'
                        };
                    }
                }
            },
            methods: {
                getQueryString(name) {
                    var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
                    var r = window.location.search.substr(1).match(reg);
                    if(r != null) {
                        return unescape(r[2]);
                    }
                    return null;
                },
                jumpToArticle(url, index) {
                 this.menuIndex = index;
                 window.location.href=url;
                }
            }
        })
    </script> 
 </body>
</html>